<template>
 <div id="tmpl">
        <!--1.0 实现新闻详情-->
	   <div class="title">
		   <h4 v-text="info.title"></h4>
		   <p>{{ info.add_time | datefmt('YYYY-MM-DD') }}  {{info.click}}次浏览</p>
	   </div>
		<div id="content" v-html="info.content" ></div>

    <!--2.0实现评论组件的集成  -->
      <comment :id ='id'></comment>

	</div>
</template>
<script>
import { Toast } from 'mint-ui';
import common from '../../kits/common.js';
//10.0 导入评论组件
import comment from '../subcom/comment.vue';
export default {
  // 10.1注册评论组件
  components:{
      comment
  },
  data () {
    return {
        id:0,       //传入的id值
        info:{

        }
    };
  },
  created(){    //将url获取的参数和id传给info来读取渲染
        //1.0 获取url传入的id参数值赋给data中的id属性
        this.id = this.$route.params.id;
        //2.0请求服务器获取到这个id对应的详情数据对象
        this.getinfo();
  },
  methods:{
    getinfo(){
         var url = common.apidomain+"/api/getnew/"+this.id;
         this.$http.get(url).then(function(res){
                var body = res.body;
                if(body.status!=0){
                    Toast(body.message);
                    return;
                };
                //赋值
                this.info = body.message[0];  //在info里传入数据库中message返回的是一个数组 0索引的位置就是我们要的全部内容
        
         })
    }
  }
}
</script>
<style lang="css" scoped>
.title h4{
		color: #0094ff;
	}
	.title p{
		color:rgba(0,0,0,0.5);
	}

	.title,#content{
		padding: 5px;
	}

</style>